<!-- 变电站 -->
<template>
  <el-dialog
    @close="close"
    :visible="show"
    append-to-body
    :close-on-click-modal="false"
    v-loading="loading"
    element-loading-text="拼命加载中"
    element-loading-spinner="el-icon-loading"
    element-loading-background="rgba(23,69,125,0.9)"
    width="500px"
  >
    <el-form :model="form" :rules="rules" label-width="120px" ref="form">
      <el-form-item label="设备名称" prop="sbmc">
        <el-input v-model="form.sbmc" maxlength="400" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="电压等级" prop="dydj">
        <el-select v-model="form.dydj" disabled>
          <el-option
            v-for="item in commonOpts.dydjOpt"
            :key="item.value"
            :value="item.value"
            :label="item.text"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="投运日期" prop="tyrq">
        <el-date-picker
          v-model="form.tyrq"
          type="date"
          placeholder="选择日期"
          value-format="yyyy-MM-dd"
        ></el-date-picker>
      </el-form-item>
    </el-form>
    <div style="text-align: center;">
      <el-button type="primary" @click="save">设备保存</el-button>
      <el-button @click="close">取消</el-button>
    </div>
  </el-dialog>
</template>

<script>
import saveMethods from './saveMethods';
export default {
  name: 'Bdz',
  components: {},
  props: {
    show: {
      type: Boolean,
      default: false
    },
    getMap: Function,
    type: String,
    params: Object
  },
  mixins: [saveMethods],
  data() {
    return {
      loading: false,
      commonOpts: {
        dydjOpt: [{ value: 22, text: '10kV' }]
      },
      form: {
        sbmc: '',
        dydj: 32,
        tyrq: '2022-01-01',
        mbbh: 2
      },
      rules: {
        sbmc: [{ required: true, message: '请输入设备名称', trigger: 'change' }],
        dydj: [{ required: true, message: '请选择电压等级', trigger: 'change' }],
        tyrq: [{ required: true, message: '请选择投运日期', trigger: 'change' }]
      },
      options: [{ value: 32, text: '110kV' }]
    };
  },
  watch: {
    show(newVal) {
      if (newVal) {
        this.initParams();
      }
    }
  },
  methods: {
    initParams() {
      this.$nextTick(() => {
        this.form.sbmc = this.params.data.sbmc;
        this.form.dydj = this.params.data.dydj;
      });
    },
    save() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.loading = true;
          if (this.type === 'add') {
            // 保存电站信息
            this.saveNewDevice().then(() => {
              this.loading = false;
              this.$message({
                type: 'success',
                message: '保存' + this.form.sbmc + '成功'
              });
              this.close();
            });
          } else if (this.type === 'edit') {
            // 保存电站信息
            Promise.all([this.saveDeviceProperties(), this.saveDeviceAndLinesShape()]).then(() => {
              this.loading = false;
              this.$message({
                type: 'success',
                message: '保存' + this.form.sbmc + '成功'
              });
              this.close();
            });
          }
        }
      });
    },
    saveNewDevice() {
      return new Promise((resolve) => {
        let params = Object.assign({}, this.params.data, this.form);
        this.getMap()
          .api.PwghGhsjTxfw.sbjh.post_sbjh_saveEquipTemplAway({ params: params })
          .then((res) => {
            if (res.resp_code === 200) {
              resolve();
            }
          });
      });
    },
    close() {
      this.$refs.form.resetFields();
      this.$emit('update:show', false);
      this.$emit('refresh');
    }
  }
};
</script>

<style scoped></style>
